<template>
    <div class="nurseplatform">
        <Header></Header>
        <div class="s_bg">
            <div class="scd">
                <div class="b_h">
                    <div class="name">
                        <img src="./images/icon17.png" alt="">
                        <span>护工平台</span>
                    </div>
                    <div class="pst">
                        当前所在位置: <a @click.prevent="goHome">首页</a>&gt;<a @click.prevent="goPrevious" class="on">护工平台</a>
                    </div>
                </div>
            </div>
        </div>
        <div  style="width:1280px;height:600px;margin-left:90px;display:flex">
            <div style="background-color:#9DC3E6;width:800px;">
                <h3 style="margin-left:350px;display: inline;">护工信息</h3>
                <div style="margin-top:20px" v-loading="loading">
                    <nurseBody style="margin-left:100px" :nurseList='nurseList'></nurseBody>
                </div>
            </div>
            <div style="background-color:#DEEBF7;width:467px">
                <h4 style="margin-left:120px;display: inline;">互助平台-寻找护工</h4>
                <getHelp></getHelp>
            </div>
            
        </div>
        
    </div>
</template>

<script>
    import Header from "@/components/Header/Header"
    import nurseBody from "@/components/Nurse/nurseBody"
    import getHelp from "@/components/Nurse/getHelp"
    export default {
        name:'nursingPlatform',
        data(){
            return{
                nurseList:[],
                loading:false
            }
        },
        components:{Header,nurseBody,getHelp},
        methods: {
            goHome(){
                this.$router.push('/home')
            },
        },
        created() {
            this.loading = true
            this.$axios.get('/NursingPlatform/getAll').then(res=>{
                this.nurseList = res.data.data
                this.loading = false
            })
        },
    }
</script>

<style>
    .scd .b_h .pst{ position:static; text-align:left; width:90%; height:auto; line-height:150%; padding:15px 5%;}
    .scd .b_h .name, .scd_em .b_h .name{ width:260px;}
    .scd .b_h,.scd_em .b_h{ width:90%; height:60px; line-height:60px;margin-left: 90px;margin-top: 30px; border-bottom:1px solid #bbb; position:relative; text-align:left; position:relative;}
    .scd .b_h .name,.scd_em .b_h .name{ display:inline-block; *display:inline; zoom:1; height:60px; line-height:60px; color:#FFF; background:#0051AD; padding:0 30px;}
    .scd .b_h .name img,.scd .b_h .name span,.scd_em .b_h .name img,.scd_em .b_h .name span{display:inline-block; *display:inline; zoom:1; height:41px; line-height:41px; vertical-align:top; margin-top:10px; font-size:24px; color:#FFF;}
    .scd .b_h .name img,.scd_em .b_h .name img{ width:41px; height:41px; margin-right:3px;}
    .scd .b_h .pst,.scd_em .b_h .pst{ width:60%; text-align:right; position:absolute; right:10px; top:0px; font-size:14px; color:#555555; height:60px; line-height:60px;}
    .scd .b_h .pst a,.scd_em .b_h .pst a{ font-size:14px; color:#555;}
    .scd .b_h .pst a.on,.scd .b_h .pst a:hover,.scd_em .b_h .pst a.on,.scd_em .b_h .pst a:hover{ color:#0257B9;}
    .pst{ width:60%; text-align:right; position:absolute;margin-top: -10px;margin-left: 300px;  font-size:14px; color:#555555; height:60px; line-height:60px;}
     .pst a{ font-size:14px; color:#555;}
     .pst a:hover,.scd_em .b_h .pst a.on,.scd_em .b_h .pst a:hover{ color:#0257B9;}
     a.on{color:#0257B9;}
</style>
